Using interactive visual styles

Xceed Grid for WinForms provides various properties that let you specify how the grid's appearance changes as users interact with it, using interactive visual styles. The table below lists the visual styles, the elements to which they can be applied, and a description.

Visual style	Elements in the grid affected	Description
HotVisualStyle	Cell, FixedColumnSplitter, GroupMargin, Row, and RowSelector; VisualGridElementStyle	Used when the pointer moves over the item.
SelectionVisualStyle	DetailGrid, GridControl; GridStyle	Used when the item is selected and active.
InactiveSelectionVisualStyle	DetailGrid, GridControl; GridStyle	Used when the item is selected but inactive.
ErrorVisualStyle	DetailGrid, GridControl; GridStyle	Used when the item is in an error state.

Using visual styles

The following code snippet demonstrates how to set the hot visual style of the cells in a grid control, using a gradient map (see Gradient maps for details). When the pointer moves over a cell (making it "hot"), a gradient (red, light green, and blue) is displayed under that cell.

VB.NET Copy Code

VB.NET	Copy Code
`gridControl1.BeginInit()` `For Each cell As Xceed.Grid.DataCell In gridControl1.DataRowTemplate.Cells cell.HotVisualStyle.ResetGradientMap()` `'If code below is encountered again, exception thrown without this cell.HotVisualStyle.GradientMap.GradientStops.Add(New GradientStop(0, Color.Red)) cell.HotVisualStyle.GradientMap.GradientStops.Add(New GradientStop(.5, Color.LightGreen)) cell.HotVisualStyle.GradientMap.GradientStops.Add(New GradientStop(1, Color.Blue)) Next cell` `gridControl1.DataSource = Me.ordersBindingSource gridControl1.EndInit()`

gridControl1.BeginInit()

For Each cell As Xceed.Grid.DataCell In gridControl1.DataRowTemplate.Cells cell.HotVisualStyle.ResetGradientMap()

'If code below is encountered again, exception thrown without this cell.HotVisualStyle.GradientMap.GradientStops.Add(New GradientStop(0, Color.Red)) cell.HotVisualStyle.GradientMap.GradientStops.Add(New GradientStop(.5, Color.LightGreen)) cell.HotVisualStyle.GradientMap.GradientStops.Add(New GradientStop(1, Color.Blue)) Next cell

gridControl1.DataSource = Me.ordersBindingSource gridControl1.EndInit()

C# Copy Code

C#	Copy Code
`gridControl1.BeginInit();` `foreach( Xceed.Grid.DataCell cell in gridControl1.DataRowTemplate.Cells ) { cell.HotVisualStyle.ResetGradientMap();` `//If code below is encountered again, exception thrown without this cell.HotVisualStyle.GradientMap.GradientStops.Add(new GradientStop(0, Color.Red)); cell.HotVisualStyle.GradientMap.GradientStops.Add(new GradientStop(.5, Color.LightGreen)); cell.HotVisualStyle.GradientMap.GradientStops.Add(new GradientStop(1, Color.Blue)); }` `gridControl1.DataSource = this.ordersBindingSource; gridControl1.EndInit();`

gridControl1.BeginInit();

foreach( Xceed.Grid.DataCell cell in gridControl1.DataRowTemplate.Cells ) { cell.HotVisualStyle.ResetGradientMap();

//If code below is encountered again, exception thrown without this cell.HotVisualStyle.GradientMap.GradientStops.Add(new GradientStop(0, Color.Red)); cell.HotVisualStyle.GradientMap.GradientStops.Add(new GradientStop(.5, Color.LightGreen)); cell.HotVisualStyle.GradientMap.GradientStops.Add(new GradientStop(1, Color.Blue)); }

gridControl1.DataSource = this.ordersBindingSource; gridControl1.EndInit();

The following code snippet demonstrates how to set the selction visual style of the rows in a grid control. When a row is selected, its foreground and background colors will be changed to red and silver, respectively.

VB.NET	Copy Code
`GridControl1.SelectionVisualStyle.ForeColor = Color.Red GridControl1.SelectionVisualStyle.BackColor = Color.Silver`

C#	Copy Code
`gridControl1.SelectionVisualStyle.ForeColor = Color.Red; gridControl1.SelectionVisualStyle.BackColor = Color.Silver;`